import LocalStorageKey from '@/constant/LocalStorageKey'
import { useAppSelector } from '@/store'
import { TabPane, Tabs } from '@douyinfe/semi-ui'
import { useRef, useState } from 'react'
import LoginRegisterBase from '../../components/LoginRegisterBase/LoginRegisterBase'
import ForgotPasswordSendByEmail from '../ForgotPasswordSendByEmail/ForgotPasswordSendByEmail'
import ForgotPasswordSendByPhone from '../ForgotPasswordSendByPhone/ForgotPasswordSendByPhone'

export default function ForgotPasswordSend() {
  const [loading, setLoading] = useState(false)
  const userBaseInfo = useAppSelector((state) => state.user.userBaseInfo)
  const jwt = localStorage.getItem(LocalStorageKey.JWT)
  const noPassword = useRef(false) // 是否：没有密码
  if (jwt && !userBaseInfo.passwordFlag) {
    noPassword.current = true
  }

  return (
    <LoginRegisterBase name={noPassword.current ? '设置密码' : '忘记密码'}>
      <Tabs>
        <TabPane tab="通过邮箱" itemKey="1" disabled={loading}>
          <ForgotPasswordSendByEmail
            loading={loading}
            setLoading={setLoading}
            noPassword={noPassword.current}
          ></ForgotPasswordSendByEmail>
        </TabPane>
        <TabPane tab="通过手机号" itemKey="2" disabled={loading}>
          <ForgotPasswordSendByPhone
            loading={loading}
            setLoading={setLoading}
            noPassword={noPassword.current}
          ></ForgotPasswordSendByPhone>
        </TabPane>
      </Tabs>
    </LoginRegisterBase>
  )
}
